<div class="modal modal-default fade show" id="modal-nav-articles-{{$ctrl.srcId}}" ng-init="$ctrl.loadArticles()">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <div class="row">
                    <div class="col-md-12">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <filter-list request="$ctrl.request" callback="$ctrl.loadArticles(pageIndex)"></filter-list>
                    </div>

                </div>
            </div>
            <!-- <div class="modal-body" style="height: calc(100vh - 143px);overflow-y: auto;"> -->
            <div class="modal-body">
                <div class="tab-pane" ng-if="$ctrl.navs.length>0">
                    <navs data="$ctrl.navs" prefix="'article-nav'" key="'articleId'" details-url="'/portal/article/details/'" model="'nav-page-article'"></navs>

                </div>


            </div>
            <div class="modal-footer">
                <div class="row">
                    <div class="col-md-12">
                        <paging class="small" page="$ctrl.data.page" page-size="$ctrl.data.pageSize" total="$ctrl.data.totalItems" ul-class="pagination justify-content-end" a-class="page-link" paging-action="$ctrl.loadArticles(page-1)" scroll-top="true">
                        </paging>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <a class="btn btn-success" ng-click="$ctrl.saveSelected()">Save</a>
                    </div>
                </div>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
